/******************** 
	作用:消息预览
	作者:蔡俊雄
	版本:V1.0
	时间:2015-07-24
********************/
body{
	margin: 0 !important;
	padding: 0 !important;
}
.reply-wrapper{
	/*margin-top: 10px;*/
	position: relative;
	width:344px;
	height:721px;
	background: url(/public/images/phone-bg.png) no-repeat;
}
.reply-container{
	position: absolute;
	left:16px;
	top:85px;
	width:312px;
	height:551px;
}
.reply-container *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
:after,
:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.clearfix:after,
.clearfix:before{
	display: table;
	content: " "
}
.clearfix:after{
	clear: both
}
.chat-frame {
	background-color: #ebebeb;
	padding: 10px;
	width: 100%;
	height: 100%;
	overflow: auto;
	overflow-x: hidden;
	font-family: 'microsoft yahei', Verdana, Arial, Helvetica, sans-serif;
}
.left-frame,.right-frame {
	position: relative;
	margin-bottom: 10px;
	width:100%;
}
.left-frame{
	padding-right: 135px;
}
.right-frame{
	padding-left: 135px;
}
/*头像*/
.head-image {
	width: 50px;
	height: 50px;
}
.head-image img {
	width: 100%;
	height: 100%;
	border: none;
}
.left-frame .head-image {
	position: absolute;
	left:0px;
	top:0px;
}
.right-frame .head-image {
	position: absolute;
	right:0px;
	top:0px;
}
/*内容容器*/
.chat-wrapper {
	position: relative;
	font-size: 16px;
	line-height: 20px;
	color: #000;
}
.left-frame .chat-wrapper {
	left:60px;
	top:0px;
}
.right-frame .chat-wrapper {
	right:60px;
	top:0px;
}
/*内容*/
.chat-content{
	width:auto;
	padding: 10px;
	border-radius: 5px;
	min-width: 50px;
	min-height: 50px;
}
.left-frame .chat-content {
	background-color: #fbfbfb;
	float: left;
}
.right-frame .chat-content {
	background-color: #b2e866;
	float: right;
}
/*小图标*/
.left-frame .triangle {
	position:absolute;
    top:25px;
    margin-top:-8px;
    left:-8px;
    display:block;
    width:0;
    height:0;
    overflow:hidden;
    line-height:0;
    font-size:0;
    border-bottom:8px solid transparent;
    border-top:8px solid transparent;
    border-left:none;
    border-right:8px solid #fbfbfb;
}
.right-frame .triangle {
	position:absolute;
    top:25px;
    margin-top:-8px;
    right:-8px;
    display:block;
    width:0;
    height:0;
    overflow:hidden;
    line-height:0;
    font-size:0;
    border-bottom:8px solid transparent;
    border-top:8px solid transparent;
    border-left:8px solid #b2e866;
    border-right:none;
}
/*中间块*/
.center-frame{
	background-color: #fff;
	border:1px solid #d2d2d2;
	margin-left: 10px;
	margin-right: 10px;
	padding: 10px;
	font-size: 16px;
	line-height: 20px;
	border-radius: 3px;
}
.center-frame .title{
}
.center-frame .time{
	font-size: 12px;
	color: #ababab;
	margin-top: 10px;
}
.center-frame .center-content{
	color: #ababab;
	margin-top: 10px;
}
.center-frame .center-content img{
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}
.center-frame .reading{
	color: #ababab;
	margin-top: 25px;
}
.center-frame .reading a{
	text-decoration: none;
	color: #000;
}
